<!-- 导入提示弹窗 -->
<template>
  <div v-drag>
    <div class="mask" @click="closeTip"></div>
    <div class="edit_box">
      <div class="box_head">
        <p>导入提示</p>
        <i @click="closeTip"></i>
      </div>
      <div class="box_body">
        <div class="line">
          <p v-if="data.successCount" class="success">导入成功！</p>
          <p v-else class="fail">导入失败！</p>
        </div>
        <div class="line">成功条数：<i style="color: #67c271">{{data.successCount}}</i>，失败条数：<i style="color: #e40000">{{data.failedCount}}</i></div>
        <div class="line" v-if="data.failedData&&data.failedData.length!==0">以下数据导入失败：</div>
        <div v-if="data.failedData&&data.failedData.length!==0" >
          <div v-for="(item,index) in data.failedData" :key="index" class="line">
            <span>行号：{{item.row}}，</span>
            <span>失败原因：{{item.message}}</span>
          </div>
        </div>
      </div>
      <div class="box_foot">
        <span @click="closeTip">取消</span>
        <span @click="closeTip">确定</span>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  props:['data'],
  data(){
    return{

    }
  },
  mounted() {
  },
  methods:{
    closeTip() {
      this.$emit('listenToChild', false)
    }
  }
}
</script>

<style scoped>
.success {
  color: #67c271;
}
.fail{
  color: #e40000;
}
</style>
